<template>
  <el-row>
    <el-col style="background-color: #FFFFFF">
      <div class="archive-api">
        <anchor v-model="anchor">
          <anchor-item label="基础API" name="1" class="anchor-item">
            <template>
              <v-md-editor v-model="text1" mode="preview"></v-md-editor>
            </template>
          </anchor-item>
          <anchor-item label="地图类API" name="2" class="anchor-item">
            <template>
              <v-md-editor v-model="text2" mode="preview"></v-md-editor>
            </template>
          </anchor-item>
          <anchor-item label="控件类API" name="3" class="anchor-item">
            <template>
              <v-md-editor v-model="text3" mode="preview"></v-md-editor>
            </template>
          </anchor-item>
          <anchor-item label="数据解析类API" name="4" class="anchor-item">
            <template>
              <v-md-editor v-model="text4" mode="preview"></v-md-editor>
            </template>
          </anchor-item>
          <anchor-item label="专业API" name="5" class="anchor-item" >
            <template>
              <v-md-editor v-model="text5" mode="preview"></v-md-editor>
            </template>
          </anchor-item>
          <anchor-item label="历史分析API" name="6" class="anchor-item">
            <template>
              <v-md-editor v-model="text6" mode="preview"></v-md-editor>
            </template>
          </anchor-item>
          <anchor-item label="离线API" name="7" class="anchor-item">
            <template>
              <a href="/static/pdf/11011.pdf" target="_blank">离线文件下载</a>
            </template>
          </anchor-item>
        </anchor>
      </div>
    </el-col>
  </el-row>
</template>

<script>

//
import VueMarkdownEditor from '@kangc/v-md-editor';
import '@kangc/v-md-editor/lib/style/base-editor.css';
import githubTheme from '@kangc/v-md-editor/lib/theme/github.js';
import '@kangc/v-md-editor/lib/theme/style/github.css';
import hljs from 'highlight.js';

VueMarkdownEditor.use(githubTheme, {
  Hljs: hljs,
});

Vue.use(VueMarkdownEditor);

import Anchor from '@/components/Anchor/Anchor'
import AnchorItem from '@/components/Anchor/AnchorItem'
import {devPublic} from '@/api/development-center'
export default {
  name: "ArchiveList",
  components: {Anchor, AnchorItem},
  mixins:[devPublic],
  data() {
    return {
      anchor: '1'
    }
  },
}
</script>


<style lang="scss" scoped>
  .archive-api{
    position: inherit;
  }

  .anchor-item {
    margin-bottom: 15px;
    background-color: #fff;

    .text {
      padding: 20px;
    }
  }
</style>